<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><%= web_title%></title>
    <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all">
    <link rel="stylesheet" href="/ruoling/css/ruoling-ui.css">
    <link rel="stylesheet" href="/ruoling/css/ruoling-load.css">
</head>
<body>
    <div class="layui-fluid" >
       <div class="Yiling-white Yiling-top">
            <form class="layui-form">
                <ul>
                    <li class="Yiling-paddingLi" >
                        <span>字典名称:</span> <input type="text" name="sys_dict_name"  placeholder="请输入字典名称" autocomplete="off" class="layui-input Yiling-width200">
                    </li>
                    <li class="Yiling-paddingLi">
                        <button type="button" lay-submit lay-filter="FormSearch" class="layui-btn layui-btn-sm layui-btn-radius"><i class=" layui-icon layui-icon-search" style="font-size:14px"></i>搜索</button>
                        <button type="button" id="CloseSubmit" class="layui-btn layui-btn-sm layui-btn-radius  layui-btn-warm"><i class=" layui-icon layui-icon-refresh-3" style="font-size:14px"></i>重置</button>
                    </li>
                </ul>
            </form>
       </div>
    </div>
    <div class="layui-fluid">
        <div class="Yiling-white Yiling-top">
            <table id="Yiling-table" lay-filter="Yiling-table"></table>
        </div>
    </div>
</body>
<!-- 工具栏模板： -->
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm Yliing-blue"  lay-event="add"> <i class="layui-icon layui-icon-add-1"></i>新增</button>
  </div> 
</script>
</html>
<script src="/layuiadmin/layui/layui.js"></script>
<script>

layui.config({
    base:""
}).extend({
    Yiling:"/libs/ruoling-request/js/Yiling-Request"
}).use(["table","layer","jquery","form","Yiling"],function(){
    let table = layui.table;
    let layer = layui.layer;
    let $ = layui.jquery;
    let form = layui.form;
    let request = layui.Yiling.YI_Ajax;

    let tableInt = table.render({
            elem:"#Yiling-table",
            height:"full",
            skin: 'line',
            title:"字典类型",
            toolbar:"#toolbarDemo",
            url:"/admin/v1/api/dicttype/list",
            page:true, //开启分页
            cols: [[ //表头
                {type:"checkbox",width:80,fixed:'left'}
                ,{field: 'ID', title: 'ID', width:80,fixed: 'left'}
                ,{field: 'sys_dict_name', title: '字典名称', width:140}
                ,{field: 'sys_dict_datatype', title: '字典类型', width:160,templet:"#sys_dict_datatypeSet"}
                ,{field: 'sys_dict_status', title: '状态', width:120,templet:"#sys_dict_statusSet"}
                ,{field: 'sys_dict_remark', title: '备注', width:160}
                ,{field: 'Create_time', title: '创建时间', width: 180,templet:"#SetDateCrete"}
                ,{title: '操作',templet:"#BarOper",minWidth:250,fixed:"right"}
            ]],
        });
    let ToolEditIndex = null;
    table.on("tool(Yiling-table)",function(obj){   //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
        let data = obj.data;   //获取当前数据
        if(obj.event == "tooldel"){

            layer.confirm('是否需要删除！', {
                btn: ['确认', '取消'] //可以无限个按钮
            }, function(index, layero){
                //按钮【按钮一】的回调
                new request().SetUrl("/admin/v1/api/dicttype/delete").SetType("POST").SetDataPara({Id:data.ID}).Alone().Init(function(result){
                    window.LoadTable();
                });
                layer.close(index)
            }, function(index){
                //按钮【按钮二】的回调
                layer.close(index)
            });
        }else if(obj.event == "tooledit"){
            ToolEditIndex = layer.open({
                            type:2,
                            content:"/admin/system/dicttype/edit/view?Id="+data.ID,
                            title:"字典类型编辑",
                            maxmin:true,
                            shadeClose:false,
                            area:["800px","600px"],
                            success:function(){
                            }
                    })
        }else if(obj.event == "tooldict"){
            parent.layui.index.openTabsPage("/admin/system/dictdata/list/view?type="+data.sys_dict_datatype,"字典数据")
        }
    });
    /**
     * 检索
     * **/
    form.on('submit(FormSearch)', function(data){
      // layer.msg(JSON.stringify(data.field));
        let obj = data.field;
        tableInt.reload({
            where:{sys_dict_name:obj.sys_dict_name}
        })
        return false;
    });

    let CloseSubmit = document.querySelector("#CloseSubmit");
    CloseSubmit.addEventListener("click",function(){
        window.LoadTable();
        return false;
    });

    table.on("toolbar(Yiling-table)",function(obj){
        let data = obj.data;

        switch(obj.event){
            case "add":
                OpenAdd();
                break;
        }
    });

    let AddIndex = null;
    let OpenAdd = function () {
       AddIndex = layer.open({
                        type:2,
                        content:"/admin/system/dicttype/add/view",
                        title:"字典类型添加",
                        maxmin:true,
                        shadeClose:false,
                        area:["800px","600px"],
                        success:function(){

                        }

                  });
    };
    //调用方法
    window.LoadTable = function (){
       
        tableInt.reload({
            where:{}
        })
    };
})
</script>

<script type="text/html" id="TypeBar">
    {{Setcartetype(d.cartetype)}}
</script>

<!-- 时间格式化 -->
<script type="text/html" id="SetDateCrete">
    {{FormDate(d.Create_time,"yyyy年MM月dd日 HH:mm:ss")}}
</script>

<script type="text/html" id="BarOper">
    {{BarOpertype(d)}}
</script>


<script type="text/html" id="sys_dict_datatypeSet">
    {{sys_dict_datatypeSetFn(d.sys_dict_datatype)}}
</script>

<script type="text/html" id="sys_dict_statusSet">
    {{sys_dict_statusSetFn(d.sys_dict_status)}}
</script>
<script>

    function sys_dict_statusSetFn(value){
        if(value == 1){
            return '<button class="layui-btn layui-btn-xs Yliing-blue">正常</button>';
        }else if(value == 0){
            return '<button class="layui-btn layui-btn-xs Yiling-Red">禁止</button>'
        }
    }
    function sys_dict_datatypeSetFn(value){
        return `<a  lay-event="tooldict" style="color:black;text-decoration: underline;cursor: pointer">${value}</a>`
    }
    function BarOpertype(){
        return `<div class="Barmore">
                    <button class="layui-btn layui-btn-xs Yliing-blue" lay-event="tooledit"><i class="layui-icon layui-icon-edit"></i>编辑</button>
                     <button class="layui-btn layui-btn-xs Yliing-blue" lay-event="tooldict"><i class="layui-icon layui-icon-list"></i>列表</button>
                    <button class="layui-btn layui-btn-xs Yiling-Red" lay-event="tooldel"><i class="layui-icon layui-icon-close"></i>删除</button>
<!--                    <button class="layui-btn layui-btn-xs Yiling-cyanBlue" lay-event="toolMore"><i class="layui-icon layui-icon-right"></i>更多操作</button>-->
<!--                    <button class="layui-btn layui-btn-xs Yiling-cyanBlue" lay-event="toolmumber"><i></i>分配用户</button>-->
                </div>`
    }

    function FormDate(d,str){
        return layui.util.toDateString(d, str)
    }
</script>


